<template>
	<div class="wx-login-container">
		<!-- 二维码容器 -->
		<div id="ww_login" ref="qrContainer"></div>
	</div>
</template>

<script setup>
	import { ref, onMounted } from 'vue'
	import * as ww from '@wecom/jssdk'

	const emit = defineEmits(['loginSuccess', 'loginFail'])
	const qrContainer = ref(null)

	// 初始化登录面板
	const initLogin = () => {
		// 初始化登录组件
		const wwLogin = ww.createWWLoginPanel({
			el: '#ww_login',
			params: {
				login_type: 'CorpApp',
				appid: 'wwe4c18b63c565e438',
				agentid: '1000006',
				redirect_uri: 'https://www.gzxjrkj.com',
				state: 'loginState',
				redirect_type: 'callback',
				panel_size: 'small'
			},
			onCheckWeComLogin({ isWeComLogin }) {
				console.log(isWeComLogin)
			},
			onLoginSuccess({ code }) {
				console.log(1111)
				console.log(code)
			},
			onLoginFail(err) {
				console.log(err)
			}
		})
	}

	onMounted(() => {
		initLogin()
	})
</script>

<style scoped>
	.wx-login-container {
		width: 300px;
		margin: 0 auto;
		text-align: center;
	}

	.error {
		color: red;
	}
</style>
